import React from 'react';
import { hydrateRoot } from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
import configureStore from '../store';
import App from '../views/app';

// 使用服务器端传递的初始状态创建 store
const { store, persistor } = configureStore(window.__INITIAL_STATE__);

const rootElement = document.getElementById('root');
if (rootElement && rootElement.hasChildNodes()) {
  rootElement.innerHTML = '';
}

if (rootElement) {
  hydrateRoot(
    rootElement,
    <Provider store={store}>
      <PersistGate loading={null} persistor={persistor}>
        <BrowserRouter>
          <App />
        </BrowserRouter>
      </PersistGate>
    </Provider>
  );
} else {
  console.error('Root element not found');
}
